<svg width="250" height="345">
<g transform="translate(0, 10)">
    <!-- x1 "error bar" -->
    <line stroke="black" stroke-width="1" stroke-dasharray="5,5" x1="20" x2="20" y1="50" y2="10" class="width-expanded" /> 

    <!-- x2 "error bar" -->
    <line stroke="black" stroke-width="1" stroke-dasharray="5,5" x1="95" x2="95" y1="50" y2="30" class="width-expanded" /> 

    <!-- Width "error bar" -->
    <line stroke="black" stroke-width="1" x1="20" x2="20" y1="60" y2="70" />    
    <line stroke="black" stroke-width="1" x1="20" x2="95" y1="65" y2="65" />
    <line stroke="black" stroke-width="1" x1="95" x2="95" y1="60" y2="70" /> 

    <rect fill="steelblue" stroke="black" stroke-width="0" width="75" height="175" x="20" y="80" />

    <!-- y1 "error bar" -->
    <line stroke="black" stroke-width="1" stroke-dasharray="5,5" x1="115" x2="150" y1="80" y2="80" class="height-expanded" />

    <!-- y2 "error bar" -->
    <line stroke="black" stroke-width="1" stroke-dasharray="5,5" x1="115" x2="150" y1="255" y2="255" class="height-expanded" /> 

    <!-- Height "error bar" -->
    <line stroke="black" stroke-width="1" x1="105" x2="115" y1="80" y2="80" />    
    <line stroke="black" stroke-width="1" x1="110" x2="110" y1="80" y2="255" />
    <line stroke="black" stroke-width="1" x1="105" x2="115" y1="255" y2="255" /> 
</g>
</svg>

<div class="y1 height-expanded field" field="y1">
    <label>y1</label>
</div>

<div class="y2 height-expanded field" field="y2">
    <label>y2</label>
</div>

<div class="height field" field="height">
    <label class="contract icon">Height</label>
    <input type="number" value="150" class="value">
</div>

<div class="x1 width-expanded field" field="x1">
    <label>x1</label>
</div>

<div class="x2 width-expanded field" field="x2">
    <label>x2</label>
</div>

<div class="width field" field="width">
    <label class="contract icon">Width</label>
    <input type="number" value="50" class="value">
</div>

<div class="fill field" field="fill">
    <label>Fill</label><br />
    <input type="color" value="#4682b4" class="value">
</div>

<div class="stroke field" field="stroke">
    <label>Stroke</label>
    <input type="color" value="#000" class="value">
</div>

<div class="strokeWidth field" field="strokeWidth">
    <label>Stroke Width</label>
    <input type="range" min="0" max="10" step="0.5" class="value" />
</div>